<template>
	<view class="seller" @click="details">
		<view class="avatar">
			<image :src="item.avatar||'/static/images/def_avatar.png'" mode="widthFix"></image>
		</view>
		<view class="user-info">
			<view class="nickname">{{item.nickname}}</view>
			<!-- <view class="title">诚信经营</view> -->
			<view class="item piece">发布件数：<text>{{item.publish_num}} 件</text></view>
			<view class="item day">关注天数：<text>{{item.follow_days}} 天</text></view>
		</view>
		<view class="btn" @click.stop="unFollow(index)">取消关注</view>
	</view>
</template>

<script>
	export default{
		props:{
			index:{
				type: Number,
				default: 0
			},
			item:{
				type: Object,
				default: function(){return {}}
			}
		},
		data(){
			return {}
		},
		methods:{
			details(){
				this.$emit("details", this.item.uid);
			},
			unFollow(index){
				this.$emit("unFollow", index);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.seller{
		width: 720rpx;
		display: flex;
		justify-content: start;
		background-color: #ddd;
		border-radius: 20rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;
		position: relative;
		.avatar{
			width: 20%;
			image{
				width: 100%;
				border-radius: 50%;
			}
		}
		.user-info{
			font-size: 30rpx;
			margin-left: 20rpx;
			width: 80%;
			view{
				margin-bottom: 10rpx;
				&:last-child{
					margin-bottom: 0;
				}
			}
			.title{
				color: #055D08;
			}
			.item{
				width: 50%;
				text{
					color: #999;
				}
			}
			.nickname{
				font-weight: bold;
				font-size: 34rpx;
			}
		}

		.btn{
			position: absolute;
			padding: 10rpx 20rpx;
			border: 1px solid #999;
			border-radius: 40rpx;
			bottom: 20rpx;
			right: 20rpx;
		}

	}
</style>